/**
 * 由 WangYu 创建
 * 日期 2017/9/5
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    BackHandler,
    NativeModules,
    ToastAndroid, View, TouchableOpacity, Image
} from 'react-native';
import CardStackStyleInterpolator from 'react-navigation/src/views/CardStackStyleInterpolator';
import SplashPage from "./page/SplashPage";
import {MainPage} from "./page/Tabs";
import WebViewPage from "./page/WebViewPage";
import {Router, Scene, Reducer, Modal, Stack, Actions} from "react-native-router-flux";
import Page1 from "./page/Page1";
import TestPage from "./page/TestPage";

const reducerCreate = params => {
    const defaultReducer = new Reducer(params);
    return (state, action) => {
        if (action.type === 'Navigation/BACK' && state.routes[state.routes.length - 1].routeName === "MainPage") {
            if (this.lastBackPressed && this.lastBackPressed + 2000 >= Date.now()) {
                //最近2秒内按过back键，可以退出应用。
                NativeModules.MyNativeMoudle.exitApp();
            }
            this.lastBackPressed = Date.now();
            ToastAndroid.show('再按一次退出应用', ToastAndroid.SHORT);
        }
        return defaultReducer(state, action);
    };
};
const styles = StyleSheet.create({
    defaultLeftIconStyle: {
        width: 44,
        // backgroundColor:'green',
        justifyContent: 'center',
        alignItems: 'center',
    },
    defaultRightIconStyle: {
        width: 44,
    }
});
export default class App extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        return <Router createReducer={reducerCreate}>
            <Scene key="root"
                   titleStyle={{alignSelf: 'center', color: 'white'}}
                   navigationBarStyle={{
                       backgroundColor: '#fd5700',
                       height: 44,
                       elevation: 0,
                   }}
                   renderLeftButton={(
                       <View style={styles.defaultLeftIconStyle}>
                           <TouchableOpacity onPress={() => {Actions.pop()}}>
                               <Image source={{uri: 'fh'}} style={{height: 44, width: 44,}} resizeMode={'center'}/>
                           </TouchableOpacity>
                       </View>)}
                   renderRightButton={(
                       <View style={styles.defaultRightIconStyle}/>
                   )}
                   gesturesEnabled
                   transitionConfig={() => ({screenInterpolator: CardStackStyleInterpolator.forHorizontal})}>

                <Scene key="Splash" component={SplashPage} title="splash" initial hideNavBar/>
                <Scene key="MainPage" component={Page1} hideNavBar/>
                <Scene key="WebView" component={WebViewPage} hideNavBar/>
                <Scene key="Test" component={TestPage} title='测试页面'/>
            </Scene>
        </Router>
    }
}






